<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8"/>
	<title>图片上传</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
	<meta name="description" content=""/>
	<meta name="author" content=""/>


	<!-- Jquery -->
	<script th:src="@{/plugins/jquery/jquery-2.1.1.js}"></script>
	<!-- Bootstrap core CSS -->
	<link rel="stylesheet" th:href="@{/plugins/bootstrap/bootstrap.min.css}">
	<!-- fileinput -->
	<script th:src="@{/plugins/fileinput/js/fileinput.js}"></script>
	<link th:href="@{/plugins/fileinput/css/fileinput.css}" rel="stylesheet" />
	<script th:src="@{/plugins/fileinput/themes/explorer-fa/theme.js}"></script>
	<script th:src="@{/plugins/fileinput/themes/fa/theme.js}"></script>

	<link rel="stylesheet" th:href="@{/plugins/font-awesome/font-awesome.css}"> <!--图标-->

</head>

<body>
<div class="container kv-main">
	<form enctype="multipart/form-data">
		<div class="form-group">
			<div class="file-loading">
				<input id="file" type="file" multiple="multiple" class="file" data-overwrite-initial="false" data-min-file-count="1" />
			</div>
		</div>
	</form>
</div>


<script th:inline="javascript">
	/*<![CDATA[*/
    var photoAlbumId = /*[[${photoAlbumId}]]*/;
    $("#file").fileinput({
        theme: 'fa',
        uploadUrl: '/photo/uploadPhoto/'+photoAlbumId, // you must set a valid URL here else you will get an error
        allowedFileExtensions: ['jpg', 'png', 'gif'],
        overwriteInitial: false,
        maxFileSize: 1000,
        maxFilesNum: 10,
        //allowedFileTypes: ['image', 'video', 'flash'],
        slugCallback: function (filename) {
            return filename.replace('(', '_').replace(']', '_');
        }
    });

    $(document).on('ready', function() {

    });
	/*]]>*/
</script>
</body>
</html>
